<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .sty01{
            font-size: 30px;
            color: red;
        }
    </style>
    <script src="../../JS/react.development.js"></script>
    <script src="../../JS/react-dom.development.js"></script>
    <script src="../../JS/babel.min.js"></script>
</head>
<body>
    <div id="root"></div>

    <script type="text/babel">
        let iNum01 = 10;
        var sTr = "sdahdkahdushuahuskh";
        var ok = true;
        var url = "http://www.baidu.com"

        function FnRev(s) {
            return s.split('').reverse().join('')
        }

        let el = (
            <div>
                <h2>jsx语法</h2>
                {/*注释*/}
                <p>{iNum01 + 5}</p>
                <p>{iNum01}</p>
                <p>{sTr}</p>
                <p>{sTr.split('').reverse().join('')}</p>
                <p>{FnRev(sTr)}</p>
                <p>{ok?'YES':'NO'}</p>
                <a href={url} className="sty01">链接</a>
            </div>
        );
        ReactDOM.render(el, document.getElementById('root'));
    </script>
</body>
</html>